<template>
  <page-scroll :footer="true">
    <template #bg>
      <div class="bg"></div>
    </template>
    <template #header>
      <gltitle
        :title="title"
        :is_name="true"
        :is_back="true"
        :is_lang="false"
        :is_kf="false"
      ></gltitle>
    </template>
    <template #content>
      <div class="container">
        <div class="empty db rel" style="z-index: 3" v-if="!show">
          <div class="flexs">
            <van-empty
              class="custom-image"
              :image="require('../../assets/images/none.png')"
              :description="$t('load.doc1')"
            />
          </div>
        </div>

        <div class="box" v-else>
          <!-- <div class="icon1">
          <img src="../../assets/images/ico10.png" alt="">
          <p>{{ $t('page.doc101') }}：V2.0</p>
        </div> -->
          <div class="info">
            <!-- <div class="name">
                  {{datas.title}}
              </div> -->
            <div class="p" v-html="datas.description"></div>
          </div>
        </div>
      </div>
    </template>
  </page-scroll>
</template>
<script>
export default {
  data() {
    return {
      title: this.$t("title.doc34"),
      datas: [],
      show: true,
    };
  },

  mounted() {
    this.$post(this.URL.home.article, {
      categoryType: "ABOUT",
    }).then((res) => {
      if (res.code == 0) {
        this.datas = res.data;
        this.show = true;
      } else {
        this.show = false;
        this.$toast(res.message);
      }
    });
  },

  methods: {
    path_url(url) {
      this.$router.push({
        path: url,
        query: {},
      });
    },
  },
};
</script>

<style lang="less" scoped>
.item {
  margin-bottom: 0.4rem;
}
.box {
  padding-bottom: 0.3rem;

  line-height: 0.44rem;
  .name {
    font-size: 0.32rem;
    font-weight: 600;
    line-height: 0.44rem;
    margin-bottom: 0.2rem;
    color: var(--COcolor3);
  }
  .p {
    margin-bottom: 0.16rem;
    font-size: 0.26rem;
    font-weight: 400;
    line-height: 0.36rem;
    color: var(--COcolor1);
    padding-bottom: 0.3rem;
  }
}
.icon1 {
  text-align: center;
  margin: 0.3rem 0;
  padding-bottom: 0.2rem;
  img {
    width: 1.84rem;
    height: 1.84rem;
    flex-shrink: 0;
    margin-bottom: 0.24rem;
  }
}
.info {
  border-radius: 0.16rem;
  background: var(--CObackgroundLinear2);
  padding: 0.24rem;
}
/deep/ .p {
  img {
    width: 100% !important;
    height: auto !important;
  }
}
</style>
